import React from 'react'
import ReactDOM from 'react-dom'
// import Handler from './02-react组件/001.函数式组件.jsx'
// import Handler from './02-react组件/002.类组件.jsx'
// import Handler from './02-react组件/003.函数式组件绑定事件.jsx'
// import Handler from './02-react组件/005.事件对象.jsx'
// import Handler from './02-react组件/006.state的定义和使用.jsx'
// import Handler from './02-react组件/007.使用this.setState修改state.jsx'
// import Handler from './02-react组件/008.抽取事件会造成的this指向问题.jsx'
// import Handler from './02-react组件/009.解决事件函数this指向问题方案一.jsx'
// import Handler from './02-react组件/010.解决事件函数this指向问题方案二.jsx'
// import Handler from './02-react组件/011.解决事件函数this指向问题方案三.jsx'
// import Handler from './04-表单处理/001.受控组件和非受控组件.jsx'
// import Handler from './04-表单处理/002.其他表单元素.jsx'
// import Handler from './04-表单处理/003.表单元素优化.jsx'
// import Handler from './04-表单处理/004.非受控组件.jsx'
// import Handler from './05-评论列表案例/index.jsx'
// import Handler from './05-评论列表案例/优化.jsx'
// import Handler from './06-props的基本使用/001.props的基本使用.jsx'
// import Handler from './06-props的基本使用/002.props的特点.jsx'
// import Handler from './07-组件通讯/001.父往子传值.jsx'
// import Handler from './07-组件通讯/002.子往父传值.jsx'
// import Handler from './07-组件通讯/003.兄弟组件传值.jsx'
// import Handler from './07-组件通讯/004.跨组件传参.jsx'
// import Handler from './08-prop深入/001.children属性.jsx'
// import Handler from './08-prop深入/002.prop-types校验.jsx'
// import Handler from './08-prop深入/003.prop-types使默认值.jsx'
// import Handler from './09-生命周期/002.更新阶段的生命周期.jsx'
// import Handler from './09-生命周期/003.更新阶段的生命周期2.jsx'
// import Handler from './09-生命周期/004.销毁阶段的生命周期.jsx'
// import Handler from './010-render-props/001.renderProps的基本使用.jsx'
// import Handler from './010-render-props/002.renderProps的复用.jsx'
// import Handler from './010-render-props/003.renderProps使用children优化.jsx'
// import Handler from './010-render-props/004.renderProps使用类型校验.jsx'
// import Handler from './011-HOC/001.高阶组件的基本使用.jsx'
// import Handler from './011-HOC/002.高阶组件的复用.jsx'
// import Handler from './011-HOC/003.高阶组件设置displayName.jsx'
// import Handler from './011-HOC/004.高阶组件设置传递props.jsx'
import Handler from './011-HOC/005.代码优化.jsx'

ReactDOM.render(
  <Handler />,
  document.getElementById('root')
)

// 08. 002.prop-types校验
// ReactDOM.render(
//   <Handler name="你好" age={22} func={ () => {console.log('1')} }/>,
//   document.getElementById('root')
// )

// 08. 001.children属性的使用
// ReactDOM.render( 
//   <Handler>
//     {/* 1. 传递值 */}
//     {/* <span>nihao</span>
//     <i>hello</i> */}

//     {/* 2. 传递函数 */}
//     { () => {console.log('插槽传递函数')} }
//   </Handler>,
//   document.getElementById('root')
// )

// const span = <span>我是span</span>
// const fn = () => { return "我是函数fn" }

// ReactDOM.render(
//   <Handler name="Tom" age="10" bol={ true } htmlJsx={ span } fn={ fn }/>,
//   document.getElementById('root')
// )